<script setup>

import useAssetCategoryStore from '@/store/modules/assetCategory'
import api from "@/api/setup/menu.js";
import treeUtils from '@/utils/tree.js'

const props = defineProps({
  /**当前双向数据绑定的值 */
  value: {
    type: [String, Number],
    default: ''
  },
});

const emit = defineEmits(['update:value']);

const assetCategoryStore = useAssetCategoryStore()
const treeData = ref(assetCategoryStore.getTreeData());

function getTreeData() {
  api.list().then((response)=>{
    let list = response.data;
    list = list.map(item=> {
      return {
        id: item.menuId,
        value: item.menuId,
        label: item.menuName,
        parentId: item.parentId
      }
    });
    treeData.value = treeUtils.handleTree(list);
  })
}

onMounted(()=> {
  getTreeData()
})

const valueId = computed({
  get: () => props.value,
  set: (val) => {
    emit('update:value', val)
  }
});

function onChange(item) {
  emit('update:name', item.label);
}

</script>

<template>
  <el-tree-select
      v-model="valueId"
      :data="treeData"
      check-strictly
      :render-after-expand="false"
      @change="onChange"
      style="width: 100%"
  />
</template>

<style scoped lang="scss">

</style>